<div class="login-form-wrap">
    <form nz-form class="login-form" [formGroup]="validateForm" (ngSubmit)="submitForm()">
        <nz-tabset [nzAnimated]="false">
            <nz-tab nzTitle="账号密码登录">
                <nz-form-item>
                    <nz-form-control nzErrorTip="请输入用户名!">
                      <nz-input-group [nzSize]="'large'" nzPrefixIcon="user">
                        <input [placeholder]="'没有账号密码直接登陆'" type="text" nz-input formControlName="userName" placeholder="用户名"/>
                      </nz-input-group>
                    </nz-form-control>
                  </nz-form-item>
                  <nz-form-item>
                    <nz-form-control nzErrorTip="请输入密码!">
                      <nz-input-group [nzSize]="'large'" nzPrefixIcon="lock">
                        <input autocomplete="on" [placeholder]="'no username and password,just login'" type="password" nz-input formControlName="password" placeholder="密码"/>
                      </nz-input-group>
                    </nz-form-control>
                  </nz-form-item>
            </nz-tab>
            <nz-tab nzTitle="手机号码登录">
                <nz-form-item>
                    <nz-form-control nzErrorTip="请输入用户名!">
                      <nz-input-group [nzSize]="'large'" nzPrefixIcon="mobile">
                        <input autocomplete="on" type="text" nz-input formControlName="userName" placeholder="手机号"/>
                      </nz-input-group>
                    </nz-form-control>
                  </nz-form-item>
                  <nz-form-item  nz-row nzJustify="space-between">
                    <nz-form-control class="flex-1" style="max-width: 65%;" nz-col [nzXs]="15" [nzSm]="16" nzErrorTip="请输入验证码!">
                      <nz-input-group [nzSize]="'large'" nzPrefixIcon="mail">
                        <input type="password" nz-input formControlName="password" placeholder="密码"/>
                      </nz-input-group>
                    </nz-form-control>
                    <button class="p-0" nz-button nz-col [nzXs]="7" [nzSm]="7" [nzSize]="'large'" nzType="default">获取验证码</button>
                  </nz-form-item>
            </nz-tab>
          </nz-tabset>
          <div nz-row class="login-form-margin">
            <div nz-col [nzSpan]="12">
              <label nz-checkbox formControlName="remember">
                <span>自动登录</span>
              </label>
            </div>
            <div nz-col [nzSpan]="12">
              <a class="login-form-forgot">忘记密码</a>
            </div>
          </div>
          <button nz-button nzSize="large" class="login-form-button login-form-margin" [nzType]="'primary'">登 录</button>
          <div class="other-way">
            <div class="other-login">
              <span>其他方式登陆</span>
              <i nz-icon nzType="alipay-circle" nzTheme="fill"></i>
              <i nz-icon nzType="taobao-circle" nzTheme="fill"></i>
              <i nz-icon nzType="weibo-circle" nzTheme="fill"></i>
            </div>
            <a routerLink="/login/register-form">注册用户</a>
          </div>
    </form>
</div>